<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<jsp:useBean id="player" class="pe.lucene.web.myrating.Player" scope="session"/>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@page import="java.util.Calendar"%>
<%@page import="java.sql.Timestamp"%>
<%@page import="java.text.DateFormat"%>
<%@page import="java.text.SimpleDateFormat"%>
<%@page import="java.util.Locale"%>
<%@page import="java.util.Date"%><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<link rel="stylesheet" type="text/css" href="index.css" />
<title>My Rating</title>
</head>
<link rel="stylesheet" type="text/css" href="../index.css" />
<link rel="stylesheet" type="text/css" href="../table.css" />
<link rel="stylesheet" type="text/css" href="../input.css" />
<script type="text/javascript"><!--

var ratingResult = 5;

function getratingResult() {
    return ratingResult;
}

function minusRating() {

   if (ratingResult -1 < 0 || ratingResult -1 > 10) 
        return ;
    
    ratingResult--;
    printImg();
}

function addRating() {

   if (ratingResult + 1 < 0 || ratingResult + 1 > 10) 
        return ;

    ratingResult++;
    printImg();
}


function printImg() {

    if (ratingResult < 0 || ratingResult > 10) {
        return ;
    }

    var holder = document.getElementById("ratingarea");
    var now_holder_count = holder.childNodes.length;

    /*
     * count expect #text, SCRIPT
     */
    for (var hcount = 0; hcount < holder.childNodes.length; hcount++ ) {
        var nodeItem = holder.childNodes.item(hcount);

        if (nodeItem.nodeName == 'SCRIPT' || nodeItem.toString() == 'object HTMLScriptElement') {
            now_holder_count--;
            holder.removeChild(nodeItem);
        }
        
        if (nodeItem.nodeName == '#text') {
            now_holder_count--;
        }
    }
    
    if (document.getElementById("ratingvalue") != null)
        document.getElementById("ratingvalue").setAttribute("value", ratingResult);

    if (now_holder_count == ratingResult) {
        // nothing
    } else if (now_holder_count > ratingResult) {
        for (var count = 0; count < now_holder_count - ratingResult; count++) {

            for (var removeCount = 0; removeCount < now_holder_count; removeCount++) {
                if (holder.lastChild.nodeName == '#text')
                    holder.removeChild(holder.lastChild);
                else {
                	holder.removeChild(holder.lastChild);
                	break;
                }
            }
        }
        
    } else if (now_holder_count < ratingResult) {
        for (var count = 0; count < ratingResult - now_holder_count ; count++) {
            var img = document.createElement("img");
            img.src ="../image/rating_star_basic.png";
            
            holder.appendChild(img);
        }
    }
}

function checkValue() {
    
}
--></script>
<body>


<table width="100%" border="0" cellpadding="0" cellspacing="0">
    <!-- title -->
    <tr background="../image/back_titlebar.png" height="30">
        <td >MyRating</td>
        <td align="right">ver 0.1</td>
    </tr>
    <!-- Decoration empty bar -->
    <tr>
        <td colspan="2" height="2" bgcolor="#959aa0"></td>
    </tr>

    <!-- Forms -->
    <form name="ratingform" action="add_ok.jsp">
    <tr>
        <td align="center" colspan="2" >
        
            <table cellpadding="0" cellspacing="0">
	            <tr>
	                <td background="../image/back_table_t_0_0.png" width="5" height="6"></td>
	                <td background="../image/back_table_t_0_1.png" height="6">
	                </td>
	                <td background="../image/back_table_t_0_2.png" width="7" height="6"></td>
	            </tr>
	            <tr>
	                <td background="../image/back_table_t_1_0.png" width="5"></td>
	                <td bgcolor="white">
	                
	                    <table border="0" cellpadding="0" cellspacing="0" width="210">
			            <tr>
			            <td valign="middle"><span onclick="minusRating()"><img src="../image/icon_rating_minus.png"></img></span></td>
			            <td>
	                
	                   <!-- Rating Area -->
	                    <span id="ratingarea">
		                <script type="text/javascript">
		                <!--
		                printImg();
		                //-->
		                </script>
		                </span>
			            </td>
			            <td valign="middle" align="right"><span onclick="addRating()"><img src="../image/icon_rating_plus.png"></img></span>
			            <input name="ratingvalue" type="hidden" id="ratingvalue" value="5"></input>
			            </td>
			            </tr>
			            </table>
		                
	                </td>
	                <td background="../image/back_table_t_1_2.png" width="7"></td>
	            </tr>
	            <tr>
	                <td background="../image/back_table_t_2_0.png" width="5" height="6"></td>
	                <td background="../image/back_table_t_2_1.png" height="6"></td>
	                <td background="../image/back_table_t_2_2.png" width="7" height="6"></td>
	            </tr>
            </table>


        
        </td>
    </tr>
    
    <!-- Date / team -->
    <tr>
        <td colspan="2" align="center">
        <table>
            <tr>
            <%
           SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd", Locale.KOREA);
           Date currentTime = new Date();
           
            %>
                <td>Date</td>
                <td><input id="date" type="text" name="date" value="<%=sdf.format(currentTime) %>"></td>
            </tr>
            <tr>
                <td>VS team</td>
                <td><input id="vs_team" type="text" name="vs_team"></td>
            </tr>        
        </table>
        
        </td>
    
    </tr>
    
    <!-- submit -->
    <tr>
        <td colspan="2" align="center"><input type="submit"></input></td>
    </tr>
    </form>
    
</table>
    
    


</body>
</html>